<template>
    <div class="assets">
        <div id="home">
            <div class="wrapCenter clearfix">
                <el-row class="tac clearfix">
                    <el-col class="left">
                        <el-menu :default-active="navNum" class="el-menu-vertical-demo">
                            <el-menu-item @click="Chargemoney" index="8">
                                <span slot="title">{{$t('message.Charge')}}</span>
                            </el-menu-item>
                            <el-menu-item @click="mention" index="9">
                                <span slot="title">{{$t('message.Mention')}}</span>
                            </el-menu-item>
                            <el-menu-item @click="rent" index="10">
                                <span slot="title">{{$t('message.moneyrecord')}}</span>
                            </el-menu-item>
                            <el-menu-item @click="estate" index="11">
                                <span slot="title">{{$t('message.Capital')}}</span>
                            </el-menu-item>
                            <el-menu-item @click="invitation" index="5">
                                <span slot="title">{{$t('message.Accounting')}}</span>
                            </el-menu-item>
                            <el-menu-item @click="fiat" index="12">
                                <span slot="title">OTC入金</span>
                            </el-menu-item>
                            <el-menu-item @click="fiats" index="13">
                                <span slot="title">OTC出金</span>
                            </el-menu-item>
                        </el-menu>
                    </el-col>
                    <!-- 邀请好友 -->
                    <div class="right">
                        <invitation v-if="invitationitem"></invitation>
                    </div>
                    <!-- 充币 -->
                    <div class="right">
                        <Chargemoney v-if="charge"></Chargemoney>
                    </div>
                    <!-- 提币 -->
                    <div class="right">
                        <Mentionmoney v-if="mentionitem"></Mentionmoney>
                    </div>
                    <!-- 提币记录 -->
                    <div class="right">
                        <Rent v-if="rentitem"></Rent>
                    </div>
                    <!-- 房产账户 -->
                    <div class="right">
                        <Realestate
                            @fatherMethod2="fatherMethod2"
                            @fatherMethod="fatherMethod"
                            v-if="estateitem"
                        ></Realestate>
                    </div>
                    <!-- OTC -->
                    <div class="right">
                        <fiatitem v-if="fiatud"></fiatitem>
                    </div>
                    <div class="right">
                        <fiatitemOut v-if="fiatOut"></fiatitemOut>
                    </div>
                </el-row>
            </div>
        </div>
    </div>
</template>
<script>
import Invitation from "./assset/invitation.vue";
import Realestate from "./assset/realestate.vue";
import Rent from "./assset/rent.vue";
import Mentionmoney from "./assset/mentionmoney.vue";
import Chargemoney from "./assset/chargemoney.vue";
import fiatitem from "./assset/fiatitem.vue";
import fiatitemOut from "./assset/fiatitemOut.vue";

import axios from "axios";
import Vue from "vue";
export default {
    data() {
        return {
            charge: false, //充币
            mentionitem: false, //提币
            rentitem: false, //房租收益
            estateitem: false, //房产账户
            invitationitem: false, //邀请好友
            navNum: "8",
            mentionFlge: false,
            fiatud: false,
            fiatOut:false

        };
    },
    created() {
        this.pagesTo();
        this.Chargemoney();
    },
    methods: {
        fatherMethod() {
            this.Chargemoney();
            this.navNum = "8";
        },
        fatherMethod2() {
            this.mention();
            this.navNum = "9";
        },
        pagesTo() {
            switch (this.$route.query.amquan) {
                case 2:
                    this.security();
                    break;
                case 3:
                    this.collection();
                    break;
                case 4:
                    this.activity();
                    break;
                case 5:
                    this.invitation();
                    break;
                case 6:
                    this.contact();
                    break;
                case 7:
                    this.order();
                    break;
                case 8:
                    this.Chargemoney();
                    break;
                case 9:
                    this.mention();
                    break;
                case 10:
                    this.rent();
                    break;
                case 11:
                    this.estate();
                    break;
                case 12:
                    this.fiat();
                    break;
                case 13:
                    this.fiats();
                    break;
            }
        },
        //  充币
        Chargemoney() {
            (this.charge = true),
                (this.orderitem = false),
                (this.contactitem = false),
                (this.collectioning = false),
                (this.mentionitem = false);
            (this.securitying = false), (this.rentitem = false);
            this.estateitem = false;
            this.fiatud = false;
            this.fiatOut = false
            this.invitationitem = false;
            this.activityitem = false;
        },
        // 提币
        mention() {
            (this.mentionitem = true),
                (this.charge = false),
                (this.orderitem = false),
                (this.contactitem = false),
                (this.collectioning = false),
                (this.securitying = false),
                (this.rentitem = false);
            this.estateitem = false;
            this.fiatud = false;
            this.fiatOut = false
            this.invitationitem = false;
            this.activityitem = false;
            this.mentionFlge = true;
        },
        // 房租收益
        rent() {
            (this.rentitem = true),
                (this.mentionitem = false),
                (this.charge = false),
                (this.orderitem = false),
                (this.contactitem = false),
                (this.collectioning = false),
                (this.securitying = false);
            this.estateitem = false;
            this.fiatud = false;
            this.fiatOut = false
            this.invitationitem = false;
            this.activityitem = false;
        },
        //     // 房产账户
        estate() {
            (this.rentitem = false),
                (this.mentionitem = false),
                (this.charge = false),
                (this.orderitem = false),
                (this.contactitem = false),
                (this.collectioning = false),
                (this.securitying = false);
            this.estateitem = true;
            this.fiatud = false;
            this.fiatOut = false
            this.invitationitem = false;
            this.activityitem = false;
        },
        //     // 邀请好友
        invitation() {
            (this.rentitem = false),
                (this.mentionitem = false),
                (this.charge = false),
                (this.orderitem = false),
                (this.contactitem = false),
                (this.collectioning = false),
                (this.securitying = false);
            this.estateitem = false;
            this.fiatud = false;
            this.fiatOut = false
            this.invitationitem = true;
            this.activityitem = false;
            this.aaa = true;
        },
        fiat() {
            (this.rentitem = false),
                (this.mentionitem = false),
                (this.charge = false),
                (this.orderitem = false),
                (this.contactitem = false),
                (this.collectioning = false),
                (this.securitying = false);
            this.estateitem = false;
            this.fiatud = true;
            this.fiatOut = false
            this.invitationitem = false;
            this.activityitem = false;
            this.aaa = true;
        },
        fiats() {
            (this.rentitem = false),
                (this.mentionitem = false),
                (this.charge = false),
                (this.orderitem = false),
                (this.contactitem = false),
                (this.collectioning = false),
                (this.securitying = false);
            this.estateitem = false;
            this.fiatud = false;
            this.fiatOut = true;
            this.invitationitem = false;
            this.activityitem = false;
            this.aaa = true;
        }
    },
    components: {
        Chargemoney,
        Mentionmoney,
        Rent,
        Realestate,
        Invitation,
        fiatitem,
        fiatitemOut
    }
};
</script>
<style lang="less" scoped>
#home {
    width: 100%;
    background: #fff;
    min-height: 750px;
    overflow: scroll;
    .wrapCenter {
        margin: 15px auto;
        max-width: 1200px;
    }
}

/deep/.el-icon-arrow-down:before {
    content: "";
}
.left {
    position: relative;
    width: 10%;
    box-sizing: border-box;
    border: 1px solid #eee;
}
.right {
    position: absolute;
    left: 12%;
    top: 0;
    width: 78%;
    box-sizing: border-box;
}
/deep/.el-menu-item {
    text-align: center;
}
/deep/.el-menu-item span {
    // text-align: center;
    display: block;
    text-align: right;
}
/deep/.el-menu-item:focus,
.el-menu-item:hover {
    outline: 0;
    background-color: #ecf5ff;
    border: 2px solid #478ee5;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
}
</style>


